import styled from 'styled-components'

interface IMainWrapper {
  colorBgContainer: string
}

export const MainWrapper = styled.div<IMainWrapper>`
  height: 100%;

  .content {
    margin: 24px 16px;
    padding: 24px;
    overflow: auto;
    background: ${(props) => props.colorBgContainer};

    /*滚动条整体样式*/

    &::-webkit-scrollbar {
      /*高宽分别对应横竖滚动条的尺寸*/
      width: 6px;
      height: 1px;
    }

    /*滚动条里面小方块*/

    &::-webkit-scrollbar-thumb {
      border-radius: 10px;
      -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
      background: #a8a0a0;
    }

    /*滚动条里面轨道*/

    &::-webkit-scrollbar-track {
      -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
      border-radius: 10px;
      background: #ededed;
    }
  }
`
